<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html>
<head>
<title>First steps in Java Gnome</title>
<link rel="stylesheet" href="/cfg/format.css" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="keywords" content="GUI, Java Gnome, first steps, Java, programming, Linux">
<meta name="description" content="First steps in Java Gnome">
<meta name="language" content="en">
<meta name="author" content="Jan Bodnar">
<meta name="distribution" content="global">

<script type="text/javascript" src="/lib/jquery.js"></script>
<script type="text/javascript" src="/lib/common.js"></script>

</head>

<body>

<div class="container">

<div id="wide_ad" class="ltow">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* 160x600, August 2011 */
google_ad_slot = "2484182563";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<div class="content">


<a href="/" title="Home">Home</a>&nbsp;
<a href="..">Contents</a>


<h1>First steps in Java Gnome</h1>

<p>
In this part of the Java Gnome programming tutorial, 
we will do our first steps in programming.
We will create simple programs. 
</p>

<div class="center">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-9706709751191532";
/* top_horizontal */
google_ad_slot = "3327173442";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<h2>Simple example</h2>

<p>
The first code example is a simple one that shows a centered window.  
</p>

<div class="codehead">simple.java</div> 
<pre class="code">
package com.zetcode;

import org.gnome.gdk.Event;
import org.gnome.gtk.Gtk;
import org.gnome.gtk.Widget;
import org.gnome.gtk.Window;
import org.gnome.gtk.WindowPosition;


/**
 * ZetCode Java Gnome tutorial
 *
 * This program is a simple Java Gnome
 * application.
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class GSimple extends Window  {

    public GSimple() {
    
        setTitle("Simple");
    
        connect(new Window.DeleteEvent() {
            public boolean onDeleteEvent(Widget source, Event event) {
                Gtk.mainQuit();
                return false;
            }
        });
        
        setDefaultSize(250, 150);
        setPosition(WindowPosition.CENTER);
        show();
    }
    
    public static void main(String[] args) {
        Gtk.init(args);
        new GSimple();
        Gtk.main();
    }
}
</pre>

<p>
The code example shows a small window in the center of the screen. 
</p>

<pre class="explanation">
 import org.gnome.gdk.Event;
 import org.gnome.gtk.Gtk;
 import org.gnome.gtk.Widget;
 import org.gnome.gtk.Window;
 import org.gnome.gtk.WindowPosition;
</pre>

<p>
We import all necessary objects. 
</p>

<pre class="explanation">
 public class GSimple extends Window  {
</pre>

<p> 
Our application is based on the <b class="keyword">Window</b> class. 
Window is a toplevel widget that is used as a container for other
widgets. 
</p>

<pre class="explanation">
 setTitle("Simple");
</pre>

<p>
Here we set the title for the window. 
</p>

<pre class="explanation">
 connect(new Window.DeleteEvent() {
     public boolean onDeleteEvent(Widget source, Event event) {
         Gtk.mainQuit();
         return false;
     }
 });
</pre>

<p>
This code cleanly exits the Java Gnome application, if we 
close the window. 
</p>

<pre class="explanation">
 setDefaultSize(250, 150);
</pre>

<p>
This line sets a default size for the window. 
</p>

<pre class="explanation">
 setPosition(WindowPosition.CENTER);
</pre>

<p>
This line centers the window on the screen. 
</p>

<pre class="explanation">
 show();
</pre>

<p>
Now we show the window. The window is not visible, until we call the 
<b class="keyword">show()</b> method. 
</p>

<pre class="explanation">
 public static void main(String[] args) {
     Gtk.init(args);
     new GSimple();
     Gtk.main();
 }
</pre>

<p>
The <b class="keyword">main()</b> method is the entry point to the 
application. It initiates and runs the program. 
</p>

<br>
<img src="/img/gui/javagnome/simple.png" alt="Simple">
<div class="figure">Figure: Simple</div>
<br>


<h2>Icon</h2>

<p>
In the next example, we show the application icon. Most window managers display the icon 
in the left corner of the titlebar and also on the taskbar.
</p>

<div class="codehead">icon.java</div> 
<pre class="code">
package com.zetcode;

import java.io.FileNotFoundException;

import org.gnome.gdk.Event;
import org.gnome.gdk.Pixbuf;
import org.gnome.gtk.Gtk;
import org.gnome.gtk.Widget;
import org.gnome.gtk.Window;
import org.gnome.gtk.WindowPosition;


/**
 * ZetCode Java Gnome tutorial
 *
 * This program shows a small icon
 * in the top left corner of the window. 
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class GIcon extends Window implements Window.DeleteEvent {

    Pixbuf icon;

    public GIcon() {
    
        setTitle("Icon");
    
        initUI();
        
        connect(this);
        
        setDefaultSize(250, 150);
        setPosition(WindowPosition.CENTER);
        show();
    }
    
    public void initUI() {

        try {
            icon = new Pixbuf("web.png");
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        }
        
        setIcon(icon);
    }
    
    public boolean onDeleteEvent(Widget widget, Event event) {
        Gtk.mainQuit();
        return false;
    }
    
    public static void main(String[] args) {

        Gtk.init(args);
        new GIcon();
        Gtk.main();
    }
}
</pre>

<p>
The code example shows the application icon. 
</p>

<pre class="explanation">
 initUI();
</pre>

<p>
We delegate the setup of the user interface to the 
<b class="keyword">initUI()</b> method. 
</p>

<pre class="explanation">
 try {
     icon = new Pixbuf("web.png");
 } catch (FileNotFoundException e) {
     e.printStackTrace();
 }
</pre>

<p>
We load a pixbuf from the file on the disk. 
</p>

<pre class="explanation">
 setIcon(icon);
</pre>

<p>
The <b class="keyword">setIcon()</b> method sets an icon for the window.
</p>


<br>
<img src="/img/gui/javagnome/icon.png" alt="Icon">
<div class="figure">Figure: Icon</div>
<br>


<h2>Buttons</h2>

<p>
In the next example, we will further enhance our programming skills with 
the Java Gnome library.
</p>

<div class="codehead">buttons.java</div>
<pre class="code">
package com.zetcode;

import org.gnome.gdk.Event;
import org.gnome.gtk.Button;
import org.gnome.gtk.Fixed;
import org.gnome.gtk.Gtk;
import org.gnome.gtk.Stock;
import org.gnome.gtk.Widget;
import org.gnome.gtk.Window;
import org.gnome.gtk.WindowPosition;

/**
 * ZetCode Java Gnome tutorial
 *
 * This program shows four buttons
 * with different characteristics.
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class GButtons extends Window {

    public GButtons() {
        setTitle("Buttons");
        
        initUI();
        
        connect(new Window.DeleteEvent() {
            public boolean onDeleteEvent(Widget source, Event event) {
                Gtk.mainQuit();
                return false;
            }
        });
        
        setDefaultSize(250, 200);
        setPosition(WindowPosition.CENTER);
        showAll();
    }
    
    
    public void initUI() {
        Fixed fix = new Fixed();

        Button btn1 = new Button("Button");
        btn1.setSensitive(false);
        Button btn2 = new Button("Button");
        Button btn3 = new Button(Stock.CLOSE);
        Button btn4 = new Button("Button");
        btn4.setSizeRequest(80, 40);

        fix.put(btn1, 20, 30);
        fix.put(btn2, 100, 30);
        fix.put(btn3, 20, 80);
        fix.put(btn4, 100, 80);
        
        add(fix);
    }
    
    public static void main(String[] args) {
        Gtk.init(args);
        new GButtons();
        Gtk.main();
    }
}
</pre>

<p>
We show four different buttons on the window. We will see a difference between 
container widgets and child widgets and will change some properties of 
child widgets. 
</p>

<pre class="explanation">
 Fixed fix = new Fixed();
</pre>

<p>
<b class="keyword">Fixed</b> widget is a non visible container widget. 
It's purpose is to contain other child widgets. 
</p>

<pre class="explanation">
 Button btn1 = new Button("Button");
</pre>

<p>
A <b class="keyword">Button</b> is a child widget. Child widgets are placed inside
containers. 
</p>

<pre class="explanation">
 btn1.setSensitive(false);
</pre>

<p>
We make this button insensitive. This means, we cannot click on it. 
Graphically the widget is grayed out.
</p>

<pre class="explanation">
 Button btn3 = new Button(Stock.CLOSE);
</pre>

<p>
The third button shows an image inside it's area. The Java Gnome
library has a built-in stock of images, that we can use. 
</p>

<pre class="explanation">
 btn4.setSizeRequest(80, 40);
</pre>

<p>
Here we change the size of the button. 
</p>


<pre class="explanation">
 fix.put(btn1, 20, 30);
 fix.put(btn2, 100, 30);
 ...
</pre>

<p>
Here we place button widgets inside fixed container widget. 
</p>

<pre class="explanation">
 add(fix);
</pre>

<p>
We set the <b class="keyword">Fixed</b> container to be the main container for 
our <b class="keyword">Window</b> widget. 
</p>


<pre class="explanation">
 showAll();
</pre>

<p>
We can either call <b class="keyword">showAll()</b> method, which shows all widgets 
at once, or we call <b class="keyword">show()</b> method on each of the widgets. 
Including containers. 
</p>


<br>
<img src="/img/gui/javagnome/buttons.png" alt="Buttons">
<div class="figure">Figure: Buttons</div>
<br>

<hr class="btm">

<p>
In this chapter, we created first programs in Java Gnome programming library. 
</p>

<br>
<div class="center"> 
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script> 
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</div> 
<br>


<div class="botNav, center">
<span class="botNavItem"><a href="/">Home</a></span> ‡ <span class="botNavItem"><a href="..">Contents</a></span> ‡ 
<span class="botNavItem"><a href="#">Top of Page</a></span>
</div>


<div class="footer">
<div class="signature">
<a href="/">ZetCode</a> last modified March 13, 2009  <span class="copyright">&copy; 2007 - 2012 Jan Bodnar</span>
</div>
</div>

</div> <!-- content -->

</div> <!-- container -->

</body>
</html>



